<template>
   <div class="title" :style="{margin:margin}">
         <div class="title-box">
                    <div class="title-label">

       </div>
       <div class="title-text">
            {{title}}
       </div>
         </div>
   </div>
</template>

<script>
export default {
    props:{
        title: { type: String, default: '' },
        margin: { type: String, default: '2rem 0 1.6rem 0' },
    },
    data(){
        return{
        }
    },
    methods:{
    }

}
</script>

<style scoped>
.title{
    /* width: 100%; */
    height: 1.6rem;
    /* padding-bottom: 30px; */
    margin-top: 2rem;
    margin-bottom: 1.6rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    }
    .title-box{
    display: flex;
    align-items: center;
    }
    .title-label{
        width: 0.3rem;
        height: 1.5rem;
        background: linear-gradient(180deg, #F5A21D 0%, #FFC86F 100%);
        border-radius: 20rem 20rem 20rem 20rem;
    }
    .title-text{
        margin-left: 0.83rem;
        font-size: 1.4rem;
font-weight: bold;
color:  var(--el-color-text-3);
    }
</style>